<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表单控件(按钮)</title>
	<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
</head>
<!--
按钮也是表单重要控件之一,制作按钮通常使用下面代码来实现：

  ☑  input[type=“submit”]

  ☑  input[type=“button”]

  ☑  input[type=“reset”]

  ☑  <button>
-->
<body>
<table class="table table-bordered table-striped">  
    <thead>  
      <tr>  
        <th>Button</th>  
        <th>class=""</th>  
        <th>Description</th>  
      </tr>  
    </thead>  
    <tbody>  
      <tr>  
        <td><button class="btn" href="#">Default</button></td>  
        <td><code>btn</code></td>  
        <td>Standard gray button with gradient</td>  
      </tr>  
      <tr>  
        <td><button class="btn btn-primary" href="#">Primary</button></td>  
        <td><code>btn btn-primary</code></td>  
        <td>Provides extra visual weight and identifies the primary action in a set of buttons</td>  
      </tr>  
      <tr>  
        <td><button class="btn btn-info" href="#">Info</button></td>  
        <td><code>btn btn-info</code></td>  
        <td>Used as an alternative to the default styles</td>  
      </tr>  
      <tr>  
        <td><button class="btn btn-success" href="#">Success</button></td>  
        <td><code>btn btn-success</code></td>  
        <td>Indicates a successful or positive action</td>  
      </tr>  
      <tr>  
        <td><button class="btn btn-warning" href="#">Warning</button></td>  
        <td><code>btn btn-warning</code></td>  
        <td>Indicates caution should be taken with this action</td>  
      </tr>  
      <tr>  
        <td><button class="btn btn-danger" href="#">Danger</button></td>  
        <td><code>btn btn-danger</code></td>  
        <td>Indicates a dangerous or potentially negative action</td>  
      </tr>  
      <tr>  
        <td><button class="btn btn-inverse" href="#">Inverse</button></td>  
        <td><code>btn btn-inverse</code></td>  
        <td>Alternate dark gray button, not tied to a semantic action or use</td>  
      </tr>  
    </tbody>  
  </table>    
</body>
</html>